<template>
	<!-- 原料/线缆/包材/仓库管理 -->
  <a-card :bordered="false">
		<!-- 顶部筛选 -->
    <div class="table-page-search-wrapper">
      <a-form layout="inline" labelAlign="right">
        <a-row :gutter="48">
          <a-col :md="8" :sm="24">
            <a-form-item label="仓库名称">
              <a-input v-model="queryParam.name" placeholder="请输入"/>
            </a-form-item>
          </a-col>
					<a-col :md="8" :sm="24">
            <a-form-item label="仓库编码">
              <a-input v-model="queryParam.code" placeholder="请输入"/>
            </a-form-item>
          </a-col>
          <a-col :md="8" :sm="24">
            <span class="table-page-search-submitButtons">
              <a-button type="primary" @click="$refs.table.refresh(true)">查询</a-button>
            </span>
          </a-col>
        </a-row>
      </a-form>
    </div>
		<div>
			<a-button icon="plus" type="primary" @click="$refs.addAndEdit.init('add')">新增</a-button>
		</div>
		<!-- 表格 -->
    <s-table
      ref="table"
			style="margin-top: 15px;"
      size="default"
      :columns="columns"
      :data="loadData"
      :alert="true"
    >
			<!-- 库位 -->
			<span slot="childNum" slot-scope="text, record">
				<span>
					<a style="font-weight: bold;" @click="$refs.childNumFormRef.init('add',record)">{{ record.childNum }}</a>
				</span>
      </span>
			<!-- 状态 -->
			<span slot="status" slot-scope="text, record">
        <a-switch v-model:checked="record.status == 0" :loading="record.loading" @change="onOrderStatusChange($event, record)"/>
      </span>
			<!-- 操作 -->
      <span slot="action" slot-scope="text, record">
        <a-button type="link" @click="$refs.addAndEdit.init('edit', record)">编辑</a-button>
      </span>
    </s-table>
    <!--  新增编辑详情弹框  -->
    <addAndEdit 
			ref="addAndEdit" 
			@ok="$refs.table.refresh(true)"
			:materialType="materialType" 
		/>
    <childNumForm 
			:materialType="materialType" 
			ref="childNumFormRef" 
			v-if="!tableLoading"
			@ok="$refs.table.refresh(true)"
		/>

  </a-card>
</template>

<script>
import {STable} from '@/components'
import {getUrlParam, MATERIAL_TYPE_ENUM, ORDER_TYPE_ENUM} from '@/utils/util'
import {
	getOrgPage,
	sysOrgAdd,
	sysOrgEdit,
	updateStatus,  //切换状态
} from '@/api/modular/system/orgManage.js'
import addAndEdit from './addAndEdit.vue'
import childNumForm from './childNumForm.vue'
       

export default {
  components: {
    STable,
    addAndEdit,
		childNumForm
  },
	watch: {
		'$route.path': function () {
			this.queryParam.materialType = this.urlParam.materialType
			setTimeout(() => {
				this.$refs.table.refresh(true)
				this.selectedRows.length = []
			}, 100)
		}
	},
	computed: {
		urlParam() {
			return getUrlParam(this.$route.path)
		},
		poolType() {
			return this.urlParam.poolType;
		},
		materialType() {
			return this.urlParam.materialType;
		},
		ORDER_TYPE_ENUM() {
			return ORDER_TYPE_ENUM;
		},
		materialTypeList() {
			let value = [{id: '', name: '全部', code: 'all'}]
			for (const key in MATERIAL_TYPE_ENUM) {
				value.push(MATERIAL_TYPE_ENUM[key])
			}
			return value
		},
	},
  data() {
    return {
      queryParam: {},  // 查询参数
			tableLoading: false,
      columns: [
        {
          title: '序号',
          width: '80px',
          customRender: (text, record, index) => `${index + 1}`
        },
        {
          title: '仓库名称',
          dataIndex: 'name'
        },
				{
          title: '仓库编码',
          dataIndex: 'code'
        },
				{
          title: '库位',
          scopedSlots: {customRender: 'childNum'},
					align: 'center',
        },
        {
          title: '状态',
					scopedSlots: {customRender: 'status'}
        },
				{
          title: '创建时间',
          dataIndex: 'createTime'
        },
        {
          title: '操作',
					align:'center',
          scopedSlots: {customRender: 'action'}
        }
      ],
      // 加载数据方法 必须为 Promise 对象
      loadData: parameter => {
				let query = {
					...this.queryParam,
					...parameter,
					unitRanId: '1440879943246770178', //类型写死为仓库
					materialType: this.urlParam.materialType,  // 物料类型
					startTime: this.appendTime(this.queryParam.timeList)[0],
					endTime: this.appendTime(this.queryParam.timeList)[1],
				}
				delete query.timeList
				this.tableLoading = true
        return getOrgPage(query).then((res) => {
					console.log('res',res)
					this.tableLoading = false
          return res.data
        })
      },
      scheduleProductionVisible: false,
      selectedRowKeys: [],
      selectedRows: [],
      defaultExpandedKeys: [],
      replaceFields: {
        key: 'id',
      },
    }
  },
  methods: {
		onOrderStatusChange(checked, row) {
      row.loading = true
      let {id} = row
      let status = checked ? 0 : 1
      let parameter = {id, status}
      updateStatus(parameter).then(res => {
        this.handleOk()
				setTimeout(() => {
					this.$message.success('操作成功')
				}, 700)
      })
    },
    handleOk() {
      this.$refs.table.refresh()
    },
  }
}
</script>

<style lang="less">
.table-operator {
  margin-bottom: 18px;
}

button {
  margin-right: 8px;
}
</style>
